<template>
  <div v-loading="loading" element-loading-text="加载中。。。">
    <!-- <el-card> -->
    <el-row>
      <el-col :span="6">
        <el-card style='height:880px;overflow:auto' shadow="never">
          <div class="branchStyle">机构树</div>
          <el-divider></el-divider>
          <!-- <el-tree :data="treedata" :props="defaultProps" @node-click="handleNodeClick" default-expand-all :expand-on-click-node="false">
            </el-tree> -->
          <select-tree :branch="BRANCHNAME" @getBranchName="getBranch" :my-show='true'></select-tree>
        </el-card>
      </el-col>
      <el-col :span="18">
        <el-card style="margin-left:1px;overflow:auto">
          <div>休假池详情</div>
          <el-divider></el-divider>
          <el-form :model="ruleForm" :rules="rules" label-position="top" ref="ruleForm" label-width="80px"
            class="demo-ruleForm">
            <el-row :gutter='10'>
              <el-col :span='6'>
                <el-form-item label="机构名称">
                  <!-- {{BRANCHNAME || '常州金坛分行'}} -->
                  <el-input v-model="BRANCHNAME" size="medium" placeholder="请输入休假池名称" disabled v-if="BRANCHNAME">
                  </el-input>
                  <el-input v-model="常州金坛分行" size="medium" placeholder="常州金坛分行" disabled v-else></el-input>
                </el-form-item>
              </el-col>
              <el-col :span='6'>
                <el-form-item label="名称" prop="HOLIDAYPOOLNAME">
                  <el-input v-model="ruleForm.HOLIDAYPOOLNAME" size="medium" placeholder="请输入休假池名称"></el-input>
                </el-form-item>
              </el-col>
              <el-col :span='6'>
                <el-form-item label="说明" prop="NOTES">
                  <el-input v-model="ruleForm.NOTES" size="medium" placeholder="请输入休假池说明"></el-input>
                </el-form-item>
              </el-col>
            </el-row>


          </el-form>
          <el-col :span="24">
            <calendar ref="mychild" :queryInfo="ruleForm.HOLIDAYLIST" @changeMonth="getMonth"></calendar>
          </el-col>
          <!-- 日历组件 -->
          <!-- 操作按钮 -->
          <el-col :span="18">

            <div style="margin-top:10px;margin-bottom:20px">
              <el-button type="primary" size="medium" @click="submitForm('ruleForm','add')" :disabled="!canAdd">新增
              </el-button>
              <el-button type="primary" size="medium" @click="submitForm('ruleForm','save')" :disabled="canAdd">保存
              </el-button>
              <el-button size="medium" @click="resetForm('ruleForm')" type="warning">重置</el-button>
              <el-button size="medium" type="danger" @click="delConfirm('month')" :disabled="canAdd">删除</el-button>
              <el-button size="medium" type="danger" @click="delConfirm('all')" :disabled="canAdd">全部删除</el-button>
            </div>
          </el-col>
        </el-card>
      </el-col>
    </el-row>
    <!-- </el-card> -->
  </div>
</template>

<script>
  import request from "@/common/utils/requestWFM";
  import calendar from './components/calendar';
  import queryVacationPool from '@/message/wfm/scheduleDataManage/vacationPool/queryVacationPool';
  import addVacationPool from '@/message/wfm/scheduleDataManage/vacationPool/addVacationPool';
  import editVacationPool from '@/message/wfm/scheduleDataManage/vacationPool/editVacationPool';
  import delVacationPool from '@/message/wfm/scheduleDataManage/vacationPool/delVacationPool';
  import Query from '@/message/wfm/baseData/branchManage/branchQuery';
  import selectTree from "@/components/selectTree5/";

  export default {
    components: {
      calendar,
      selectTree
    },
    data() {
      return {
        loading: false,
        ruleFormBackUp: {}, //初始数据备份
        resData: "",
        treedata: [],
        // 机构
        defaultProps: {
          children: 'children',
          label: 'BRANCHNAME'
        },
        //是否可以新建
        canAdd: true,
        BRANCHNAME: this.$store.getters.BranchName, //机构名称
        BRANCHNO: this.$store.getters.BranchNum,
        ruleForm: {
          HOLIDAYPOOLNAME: '',
          NOTES: ''
        },
        rules: {
          HOLIDAYPOOLNAME: [{
            required: true,
            message: '请输入休假池名称',
            trigger: 'blur'
          }],
          NOTES: [{
            required: true,
            message: '请输入休假池说明',
            trigger: 'blur'
          }],
        },
        month: '',
        childrenInfo: [],
        HOLIDAYLIST: [],
      }
    },
    computed: {},
    watch: {},
    created() {

    },
    mounted() {
      // this.querytype();
    },
    methods: {
      delConfirm(data) {
        var msg = '';
        if (data == 'all') {
          msg = '是否确定删除该机构下所有休假池，删除操作将无法恢复！';
        } else {
          msg = '是否确定删除该月休假池，删除操作将无法恢复！';
        }
        this.$confirm(msg, "提示", {
            confirmButtonText: "确定",
            cancelButtonText: "取消",
            type: "warning"
          })
          .then(() => {
            this.delVacationPool(data);
          })
          .catch(() => {
            this.$message({
              type: "info",
              message: "已取消删除"
            });
          });
      },
      submitForm(formName, op) {
        var that = this;
        that.HOLIDAYLIST = [];
        that.childrenInfo = this.$refs.mychild.days;
        this.$refs[formName].validate((valid) => {
          if (valid) {
            var day = '';
            that.childrenInfo.forEach((item, index) => {
              if (item.checkbox != '2' || item.time) {
                day = this.$refs.mychild.timeFormat(item.day);
                that.HOLIDAYLIST.push({
                  'DATENUM': day,
                  'ISENABLEHOLIDAY': item.time ? '1' : item.checkbox,
                  'ALLOHOURS': item.time,
                  'ENABLEHOURS': '',
                })
              }
            });
            console.log(this.childrenInfo, that.HOLIDAYLIST);
            if (that.HOLIDAYLIST.length == 0) {
              this.$message({
                type: "error",
                message: "请在日历中选择休假信息"
              });
              return;
            }
            if (op == 'add') {
              this.addVacationPool();
            } else if (op == 'save') {
              this.editVacationPool();
            }
          } else {
            console.log('error submit!!');
            return false;
          }
        });
      },
      resetForm(formName) {
        // 不是新增则把值恢复成原来的
        // this.ruleForm = JSON.parse(JSON.stringify(this.ruleFormBackUp));
        this.querytype();
        this.$refs[formName].clearValidate();
        this.$refs[formName].resetFields();
      },
      // 新增休假池
      async addVacationPool() {
        this.loading = true;
        let resBody = new addVacationPool();
        resBody.data.BRANCHNO = this.BRANCHNO;
        resBody.data.HOLIDAYPOOLNAME = this.ruleForm.HOLIDAYPOOLNAME;
        resBody.data.NOTES = this.ruleForm.NOTES;
        resBody.data.MONTHNUM = this.month;
        resBody.data.HOLIDAYLIST = this.HOLIDAYLIST;
        let response = await request(resBody);
        if (response.SYS_HEAD.ReturnCode == "000000") {
          this.$message({
            type: "success",
            message: "保存成功"
          });
          this.querytype();
        } else {
          this.$message({
            type: "error",
            message: "请求失败，错误码:" + response.SYS_HEAD.ReturnCode + "，错误信息：" + response.SYS_HEAD.ReturnMessage
          });
        }
        this.loading = false;
      },
      // 修改休假池
      async editVacationPool() {
        this.loading = true;
        let resBody = new editVacationPool();
        resBody.data.HOLIDAYPOOLID = this.ruleForm.HOLIDAYPOOLID;
        resBody.data.HOLIDAYPOOLNAME = this.ruleForm.HOLIDAYPOOLNAME;
        resBody.data.NOTES = this.ruleForm.NOTES;
        resBody.data.MONTHNUM = this.month;
        resBody.data.HOLIDAYLIST = this.HOLIDAYLIST;
        let response = await request(resBody);
        if (response.SYS_HEAD.ReturnCode == "000000") {
          this.$message({
            type: "success",
            message: "修改成功"
          });
          this.querytype();
        } else {
          this.$message({
            type: "error",
            message: "请求失败，错误码:" + response.SYS_HEAD.ReturnCode + "，错误信息：" + response.SYS_HEAD.ReturnMessage
          });
        }
        this.loading = false;
      },
      // 删除休假池
      async delVacationPool(op) {
        this.loading = true;
        let resBody = new delVacationPool();
        resBody.data.HOLIDAYPOOLID = this.ruleForm.HOLIDAYPOOLID;
        resBody.data.MONTHNUM = op === 'all' ? '' : this.month;
        let response = await request(resBody);
        if (response.SYS_HEAD.ReturnCode == "000000") {
          this.$message({
            type: "success",
            message: "删除成功"
          });
          this.querytype();
          this.$refs.mychild.initData();
        } else {
          this.$message({
            type: "error",
            message: "请求失败，错误码:" + response.SYS_HEAD.ReturnCode + "，错误信息：" + response.SYS_HEAD.ReturnMessage
          });
        }
        this.loading = false;
      },
      // 查询休假池信息
      async querytype() {
        if (this.$refs['ruleForm'] != undefined) {
          this.$refs['ruleForm'].clearValidate();
        }
        this.loading = true;
        let resBody = new queryVacationPool();
        resBody.data.MONTHNUM = this.month;
        resBody.data.BRANCHNO = this.BRANCHNO;
        let response = await request(resBody);
        if (response.SYS_HEAD.ReturnCode == "000000") {
          if (JSON.stringify(response.BODY) != "{}") {
            if (response.BODY.HOLIDAYLIST) {
              this.canAdd = false;
            } else {
              this.canAdd = true;
            }
            this.ruleForm = response.BODY;
            this.ruleFormBackUp = JSON.parse(JSON.stringify(this.ruleForm));
          } else {
            this.ruleForm = {
              HOLIDAYPOOLNAME: '',
              NOTES: '',
              HOLIDAYLIST: [],
            };
            this.canAdd = true;
          }
        } else {
          this.canAdd = true;
          this.$message({
            type: "error",
            message: "请求失败，错误码:" + response.SYS_HEAD.ReturnCode + "，错误信息：" + response.SYS_HEAD.ReturnMessage
          });
        }
        this.loading = false;
        this.HOLIDAYLIST = [];
      },
      getBranch(data) {
        this.BRANCHNAME = data.BRANCHNAME;
        this.BRANCHNO = data.BRANCHNO;
        if (this.$refs['ruleForm'] != undefined) {
          this.$refs['ruleForm'].clearValidate();
          this.$refs['ruleForm'].resetFields();
        }
        this.querytype();
      },
      // 获取月份
      getMonth(year, month) {
        this.month = month < 10 ? year + '0' + month : year + '' + month + '';
        // console.log(this.month);
        this.querytype();
      }
    }
  };

</script>


<style lang="scss" scoped>
  .is-selected {
    color: #1989FA;
  }

</style>
